<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>捞海底商城后台管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/font.css">
    <link rel="stylesheet" href="css/xadmin.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.bootcss.com/Swiper/3.4.2/js/swiper.jquery.min.js"></script>
    <script src="lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/xadmin.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

</head>

<body>
    <div class="layui-container">
        <div class="layui-row">
            <h1 style="margin: 10px; font-size: large;">用户详细信息</h1>
        </div>
        <div class="layui-row">
            <table class="layui-table">
                <colgroup>
                    <col width="150">
                    <col>
                </colgroup>
                <tbody>
                    <tr class="userId">
                        <td>用户名</td>
                        <td></td>
                    </tr>
                    <tr class="name">
                        <td>昵称</td>
                        <td></td>
                    </tr>
                    <tr class="sex">
                        <td>性别</td>
                        <td></td>
                    </tr>
                    <tr class="phone">
                        <td>手机号</td>
                        <td></td>
                    </tr>
                    <tr class="email">
                        <td>邮箱</td>
                        <td></td>
                    </tr>
                    <tr class="address">
                        <td>地址</td>
                        <td></td>
                    </tr>
                    <tr class="birthday">
                        <td>生日</td>
                        <td></td>
                    </tr>
                    <tr class="status">
                        <td>状态</td>
                        <td></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <script>
        const host = 'http://1.116.147.57:8080';
        function getQueryString(name) {
            let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            let r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return decodeURIComponent(r[2]);
            };
            return null;
        }
        function renderData(data) {
            for (key in data) {
                if (data[key] == null || data[key] == '') {
                    data[key] = '无';
                }
            }
            $tbody = $('tbody');
            $tbody.find('.userId').find('td:eq(1)').text(data.userId);
            $tbody.find('.name').find('td:eq(1)').text(data.nickName);
            $tbody.find('.sex').find('td:eq(1)').text(data.sex);
            $tbody.find('.phone').find('td:eq(1)').text(data.phone);
            $tbody.find('.email').find('td:eq(1)').text(data.email);
            $tbody.find('.address').find('td:eq(1)').text(data.address);
            $tbody.find('.birthday').find('td:eq(1)').text(data.birthday);
            $tbody.find('.status').find('td:eq(1)').text(data.status);
            
        }
        const userId = getQueryString('userId');
        axios({
            method:'get',
            url: `${host}/user/admin/${userId}`,
            headers: {
                'Authorization': localStorage.getItem('token')
            }
        }).then((result) => {
            if (result.data.status == 20) {
                renderData(result.data.data);
            } else {
                layer.msg("获取用户信息失败");
            }
        }).catch((err) => {
            
        });
    </script>
</body>

</html>